

<!-- USER HOME -->
<div class="row" ng-if="user">
    <div class="col-sm-3 center-block">
        <!-- USER MENU -->
        <div class="tile menu">
            <!-- USER INFO -->
            <div class="menu-item text-center">
                <p>{{user.login}}</p>

                <p>{{user.name}}</p>
            </div>
            <p>&nbsp;</p>
            <!-- USER STATS -->
            <div class="menu-item text-center" ng-if="user.stats">
                <p>Uploads : {{user.stats.uploads}}</p>

                <p>Files : {{user.stats.files}}</p>

                <p>Total Size : {{humanReadableSize(user.stats.totalSize)}}</p>
            </div>
        </div>
        <!-- UPLOAD FILE BUTTON -->
        <div class="tile menu">
            <div class="menu-item">
                <button type="button" class="btn btn-lg btn-primary btn-block" ng-click="mainpage()">
                    <i class="fa fa-upload"></i> Upload files
                </button>
            </div>
        </div>
        <!-- LOGOUT BUTTON -->
        <div class="tile menu">
            <div class="menu-item">
                <button type="button" class="btn btn-lg btn-primary btn-block" ng-click="logout()">
                    <i class="fa fa-sign-out"></i> Logout
                </button>
            </div>
        </div>
        <!-- TOKENS BUTTON -->
        <div class="tile menu" ng-if="display=='uploads'">
            <div class="menu-item">
                <button type="button" class="btn btn-lg btn-primary btn-block" ng-click="displayTokens()">
                    <i class="fa fa-ticket"></i> Tokens
                </button>
            </div>
        </div>
        <!-- UPLOADS BUTTON -->
        <div class="tile menu" ng-if="display=='tokens'">
            <div class="menu-item">
                <button type="button" class="btn btn-lg btn-primary btn-block" ng-click="displayUploads()">
                    <i class="fa fa-upload"></i> Uploads
                </button>
            </div>
        </div>
        <!-- DELETE ALL UPLOADS BUTTON -->
        <div class="tile menu">
            <div class="menu-item">
                <button type="button" class="btn btn-lg btn-danger btn-block" ng-click="deleteUploads()">
                    <i class="fa fa-trash"></i> DELETE UPLOADS
                </button>
            </div>
        </div>
        <!-- DELETE ACCOUNT BUTTON -->
        <div class="tile menu">
            <div class="menu-item">
                <button type="button" class="btn btn-lg btn-danger btn-block" ng-click="deleteAccount()">
                    <i class="fa fa-remove"></i> DELETE ACCOUNT
                </button>
            </div>
        </div>
    </div>
    <!-- MAIN -->
    <div class="col-sm-9">
        <!-- TOKENS -->
        <div class="row" ng-if="display=='tokens'">
            <div class="col-sm-12 col-centered">
                <div class="tile panel panel-body main">
                    <div class="row center-block text-center">
                        <p>
                            Tokens can be used to authenticate the command line client<br/>
                            They have to be specified in the ~/.plikrc file ( Token="xxxxx" )
                        </p>

                        <div class="col-xs-10 col-sm-8 col-md-6 col-xs-offset-1 col-sm-offset-2 col-md-offset-3 text-center">
                            <div class="input-group">
                                <input type="text" ng-model="comment" class="form-control" placeholder="Comment">
                                <!-- CREATE TOKEN BUTTON -->
                                <div class="input-group-btn">
                                    <button title="Browse" type="button" class="btn btn-default"
                                            ng-click="createToken(comment)">
                                        <i class="glyphicon glyphicon-plus"></i>
                                        <span class="hidden-xs hidden-sm hidden-md"> Create token</span>
                                    </button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="tile panel panel-body main text-center" ng-repeat="token in tokens">
                    <div class="row">
                        <div class="col-sm-5">
                            <i class="fa fa-search"></i>
                            <a href="" ng-click="displayUploads(token.token)">
                                {{token.token}}
                            </a>
                        </div>
                        <div class="col-sm-2 hidden-md hidden-sm hidden-xs">
                            {{token.createdAt | date:'medium'}}
                        </div>
                        <div class="col-sm-3 file-name">
                            {{token.comment}}
                        </div>
                        <div class="col-sm-2">
                            <!-- REVOKE TOKEN BUTTON -->
                            <button class="btn btn-danger btn-sm" ng-click="revokeToken(token)">
                                <span class="glyphicon glyphicon-remove"></span><span> Revoke</span>
                            </button>
                        </div>
                    </div>
                </div>
            </div>
            <!-- LOAD MORE TOKENS -->
            <div class="row" ng-if="display=='tokens' && cursor">
                <div class="col-sm-12">
                    <div class="tile panel panel-body main" ng-click="getTokens(true)">
                        <div class="row">
                            <div class="col-xs-12 text-center">
                                Load more tokens
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- TOKEN FILTER -->
        <div class="row" ng-if="display=='uploads' && token">
            <div class="col-sm-12">
                <div class="tile panel panel-body main">
                    <div class="row">
                        <div class="col-xs-12 text-center">
                            <i class="fa fa-remove" ng-click="displayUploads()"></i>
                            &nbsp;{{token}}&nbsp;
                            <!-- REMOVE UPLOADS BUTTON -->
                            <button class="btn btn-danger btn-sm" ng-click="deleteUploads(token)">
                                <span class="glyphicon glyphicon-trash"></span><span> Remove all</span>
                            </button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- UPLOADS -->
        <div class="row" ng-if="display=='uploads'">
            <div class="col-sm-12">
                <div class="tile panel panel-body main" ng-repeat="upload in uploads">
                    <div class="row">
                        <div class="col-xs-12 col-sm-4 small file-name">
                            <!-- UPLOAD ID / LINK -->
                            <a href="{{getUploadUrl(upload)}}">{{ upload.id }}</a>
                            <br/>
                            <!-- UPLOAD DATE -->
                            uploaded : {{ upload.createdAt | date:'medium' }}
                            <br/>
                            <!-- EXPIRE DATE -->
                            expire : {{ upload.expireAt | date:'medium' }}
                            <!-- TOKEN -->
                            <br ng-if="upload.token"/>
                            <span ng-if="upload.token">
                                token :
                                <a href="" ng-click="displayUploads(upload.token)">
                                    {{upload.token}}
                                </a>
                            </span>
                        </div>
                        <div class="col-xs-12 col-sm-6 small file-name">
                            <div ng-repeat="file in upload.files | filter: {status: 'uploaded'}">
                                <a href="{{getFileUrl(upload,file)}}">{{ file.fileName }}</a>
                                <button style="background-color: transparent; border: none;" data-clipboard data-clipboard-text="{{getFileUrl(upload,file)}}">
                                  <span class="glyphicon glyphicon-copy"></span>
                                </button>
                        <span class="pull-right">
                            {{ humanReadableSize(file.fileSize) }}
                        </span>
                            </div>
                        </div>
                        <div class="col-xs-12 col-sm-2 text-center">
                            <!-- REMOVE -->
                            <button class="btn btn-danger btn-sm" ng-click="deleteUpload(upload)">
                                <span class="glyphicon glyphicon-remove"></span><span
                                    class="hidden-xs hidden-sm hidden-md"> Remove</span>
                            </button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- LOAD MORE UPLOADS -->
        <div class="row" ng-if="display=='uploads' && cursor">
            <div class="col-sm-12">
                <div class="tile panel panel-body main" ng-click="getUploads(true)">
                    <div class="row">
                        <div class="col-xs-12 text-center">
                            Load more uploads
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>